<template>
  <div>
    <!-- 通过点击，切换 Switchcomponents 的值-->
    <el-button @click="Switchcomponents = 'userinfo'">个人基本信息</el-button>
    <el-button @click="Switchcomponents='jobinfo'">岗位信息</el-button>

    <!-- 使用 v-if判断 Switchcomponents的值来 实现显示与隐藏-->
    <userinfo v-if="Switchcomponents==='userinfo'" />
    <jobinfo v-if="Switchcomponents==='jobinfo'" />
  </div>
</template>

<script>
import userinfo from '../views/employees/components/user-info.vue'
import jobinfo from '../views/employees/components/job-info.vue'
export default {
  components: {
    userinfo, jobinfo
  },
  data() {
    return {
      // 这个也代表默认显示的组件
      Switchcomponents: 'userinfo'
    }
  }
}
</script>

<style>

</style>
